﻿<MCard Flat
       Color="transparent">
    <MSubheader>Min and max range slider</MSubheader>

    <MCardText>
        <MRow>
            <MCol Class="px-4">
                <MRangeSlider @bind-Value="_range"
                              Max="_max"
                              Min="_min"
                              HideDetails="true"
                              Class="align-center">
                    <PrependContent>
                        <MTextField Value="_range[0]"
                                    Class="mt-0 pt-0"
                                    HideDetails="true"
                                    SingleLine
                                    Type="number"
                                    Style="width: 60px"
                                    TValue="double"
                                    OnChange="val=>_range[0]=val"></MTextField>
                    </PrependContent>
                    <AppendContent>
                        <MTextField Value="_range[1]"
                                    Class="mt-0 pt-0"
                                    HideDetails="true"
                                    SingleLine
                                    Type="number"
                                    Style="width: 60px"
                                    TValue="double"
                                    OnChange="val=>_range[1]=val"></MTextField>
                    </AppendContent>
                </MRangeSlider>
            </MCol>
        </MRow>
    </MCardText>
</MCard>

@code {
    private IList<double> _range = new List<double>
        {
            30,
            60
        };
    private double _min = -50;
    private double _max = 90;
}

